<%@ page language="java" pageEncoding="UTF-8"%>
<div class="navbar navbar-inverse">
	<div class="navbar-inner">
		<div class="container-fluid">
			<a class="brand" href="#"><small><i class="icon-leaf"></i>
					Ace Admin</small> </a>
			<ul class="nav ace-nav pull-right">
				<li class="grey"><a href="#" class="dropdown-toggle"
					data-toggle="dropdown"> <i class="icon-tasks"></i> <span
						class="badge">4</span>
				</a>
					<ul
						class="pull-right dropdown-navbar dropdown-menu dropdown-caret dropdown-closer">
						<li class="nav-header"><i class="icon-ok"></i> 4 Tasks to
							complete</li>
						<li><a href="#">
								<div class="clearfix">
									<span class="pull-left">Software Update</span> <span
										class="pull-right">65%</span>
								</div>
								<div class="progress progress-mini">
									<div class="bar" style="width: 65%"></div>
								</div>
						</a></li>
						<li><a href="#">
								<div class="clearfix">
									<span class="pull-left">Hardware Upgrade</span> <span
										class="pull-right">35%</span>
								</div>
								<div class="progress progress-mini progress-danger">
									<div class="bar" style="width: 35%"></div>
								</div>
						</a></li>
						<li><a href="#">
								<div class="clearfix">
									<span class="pull-left">Unit Testing</span> <span
										class="pull-right">15%</span>
								</div>
								<div class="progress progress-mini progress-warning">
									<div class="bar" style="width: 15%"></div>
								</div>
						</a></li>
						<li><a href="#">
								<div class="clearfix">
									<span class="pull-left">Bug Fixes</span> <span
										class="pull-right">90%</span>
								</div>
								<div
									class="progress progress-mini progress-success progress-striped active">
									<div class="bar" style="width: 90%"></div>
								</div>
						</a></li>
						<li><a href="#"> See tasks with details <i
								class="icon-arrow-right"></i>
						</a></li>
					</ul></li>
				<li class="purple"><a href="#" class="dropdown-toggle"
					data-toggle="dropdown"> <i
						class="icon-bell-alt icon-animated-bell icon-only"></i> <span
						class="badge badge-important">8</span>
				</a>
					<ul
						class="pull-right dropdown-navbar navbar-pink dropdown-menu dropdown-caret dropdown-closer">
						<li class="nav-header"><i class="icon-warning-sign"></i> 8
							Notifications</li>
						<li><a href="#">
								<div class="clearfix">
									<span class="pull-left"><i
										class="icon-comment btn btn-mini btn-pink"></i> New comments</span> <span
										class="pull-right badge badge-info">+12</span>
								</div>
						</a></li>
						<li><a href="#"> <i
								class="icon-user btn btn-mini btn-primary"></i> Bob just signed
								up as an editor ...
						</a></li>
						<li><a href="#">
								<div class="clearfix">
									<span class="pull-left"><i
										class="icon-shopping-cart btn btn-mini btn-success"></i> New
										orders</span> <span class="pull-right badge badge-success">+8</span>
								</div>
						</a></li>
						<li><a href="#">
								<div class="clearfix">
									<span class="pull-left"><i
										class="icon-twitter btn btn-mini btn-info"></i> Followers</span> <span
										class="pull-right badge badge-info">+4</span>
								</div>
						</a></li>
						<li><a href="#"> See all notifications <i
								class="icon-arrow-right"></i>
						</a></li>
					</ul></li>
				<li class="green"><a href="#" class="dropdown-toggle"
					data-toggle="dropdown"> <i
						class="icon-envelope-alt icon-animated-vertical icon-only"></i> <span
						class="badge badge-success">5</span>
				</a>
					<ul
						class="pull-right dropdown-navbar dropdown-menu dropdown-caret dropdown-closer">
						<li class="nav-header"><i class="icon-envelope"></i> 5
							Messages</li>
						<li><a href="#"> <img alt="Alex's Avatar"
								class="msg-photo" src="avatars/avatar.png" /> <span
								class="msg-body"> <span class="msg-title"> <span
										class="blue">Alex:</span> Ciao sociis natoque penatibus et
										auctor ...
								</span> <span class="msg-time"> <i class="icon-time"></i> <span>a
											moment ago</span>
								</span>
							</span>
						</a></li>
						<li><a href="#"> <img alt="Susan's Avatar"
								class="msg-photo" src="avatars/avatar3.png" /> <span
								class="msg-body"> <span class="msg-title"> <span
										class="blue">Susan:</span> Vestibulum id ligula porta felis
										euismod ...
								</span> <span class="msg-time"> <i class="icon-time"></i> <span>20
											minutes ago</span>
								</span>
							</span>
						</a></li>
						<li><a href="#"> <img alt="Bob's Avatar"
								class="msg-photo" src="avatars/avatar4.png" /> <span
								class="msg-body"> <span class="msg-title"> <span
										class="blue">Bob:</span> Nullam quis risus eget urna mollis
										ornare ...
								</span> <span class="msg-time"> <i class="icon-time"></i> <span>3:15
											pm</span>
								</span>
							</span>
						</a></li>
						<li><a href="#"> See all messages <i
								class="icon-arrow-right"></i>
						</a></li>
					</ul></li>
				<li class="light-blue user-profile"><a
					class="user-menu dropdown-toggle" href="#" data-toggle="dropdown">
						<img alt="Jason's Photo" src="avatars/user.jpg"
						class="nav-user-photo" /> <span id="user_info"> <small>Welcome,</small>
							Jason
					</span> <i class="icon-caret-down"></i>
				</a>
					<ul id="user_menu"
						class="pull-right dropdown-menu dropdown-yellow dropdown-caret dropdown-closer">
						<li><a href="#"><i class="icon-cog"></i> Settings</a></li>
						<li><a href="#"><i class="icon-user"></i> Profile</a></li>
						<li class="divider"></li>
						<li><a href="#"><i class="icon-off"></i> Logout</a></li>
					</ul></li>
			</ul>
			<!--/.ace-nav-->
		</div>
		<!--/.container-fluid-->
	</div>
	<!--/.navbar-inner-->
</div>